<!--
  - Copyright (c) 2019.  武汉中科图灵科技有限公司
  - Date :  2019/1/5
  - Author ：F12 Console=> atob("MzMxNDkxODAwQHFxLmNvbQ==")
  - Version ：1.6.2
  -->

<template>
  <div><div class="abstatic-height"></div>
    <el-container class="unit-all-container">
      <el-container class="unit-left-info">
        <div v-show="unitList.length!=0">
        <el-row class="nework-info-wrap" v-loading="isloadbaseinfo">
          <div class="basicinfo">
            <span class="buildtitle"><i class="el-icon-caret-right"></i>基本情况</span>
            <span class="buildedit" onselectstart="return false;" v-if="isbasicinfo" v-show="basicInfo.oname!=''" unselectable="on" @click="isbasicinfo=!isbasicinfo"><i class="el-icon-edit"></i>编辑</span>
            <span class="buildedit" onselectstart="return false;" v-else unselectable="on" @click="saveBasicInfo('basicForm')"><i class="el-icon-edit-outline"></i>保存</span>
          </div>
          <el-form :model="basicInfo" :rules="basicrules" label-position="top" ref="basicForm" class="demo-basicForm">
            <el-form-item label="单位名称" prop="oname" style="float: left;">
              <el-input v-model.trim="basicInfo.oname" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="信用代码" prop="olicense" style="float: right;">
              <el-input v-model.trim="basicInfo.olicense" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="单位电话" prop="ophone" style="float: left;">
              <el-input v-model.trim="basicInfo.ophone" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="单位地址" prop="oaddress" style="float: right;">
              <el-input v-model.trim="basicInfo.oaddress" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全责任人姓名" prop="safeDutyName" style="float: left;">
              <el-input v-model.trim="basicInfo.safeDutyName" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全责任人电话" prop="safeDutyPhone" style="float: right;">
              <el-input v-model.trim="basicInfo.safeDutyPhone" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全责任人身份证" prop="safeDutyIdcard" style="float: left;">
              <el-input v-model.trim="basicInfo.safeDutyIdcard" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全管理人姓名" prop="safeManagerName" style="float: right;">
              <el-input v-model.trim="basicInfo.safeManagerName" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全管理人电话" prop="safeManagerPhone" style="float: left;">
              <el-input v-model.trim="basicInfo.safeManagerPhone" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="消防安全管理人身份证" prop="safeManagerIdcard" style="float: right;">
              <el-input v-model.trim="basicInfo.safeManagerIdcard" :disabled="isbasicinfo"></el-input>
            </el-form-item>
            <el-form-item label="" style="width: 100%;float: right;" v-if="!isbasicinfo">
              <el-button type="primary" @click="saveBasicInfo('basicForm');" style="margin-top: 10px;" size="mini">保存</el-button>
              <el-button style="margin-top: 10px;" @click="isbasicinfo=true;getUnitInfo(curunitid);clearFormTips('basicForm')" size="mini" type="text">取消</el-button>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row class="nework-info-wrap" v-loading="isloadbaseinfo">
          <div class="basicinfo">
            <span class="buildtitle"><i class="el-icon-caret-right"></i>地理信息</span>
            <span class="buildedit" onselectstart="return false;" v-if="isareainfo" v-show="basicInfo.oname!=''" unselectable="on" @click="isareainfo=!isareainfo"><i class="el-icon-edit"></i>编辑</span>
            <span class="buildedit" onselectstart="return false;" v-else unselectable="on" @click="saveAreaInfo('areaForm')"><i class="el-icon-edit-outline"></i>保存</span>
          </div>
          <el-form :model="areaInfo" :rules="arearules" label-position="top" ref="areaForm" class="demo-basicForm">
            <el-form-item label="详细地址" prop="addressDetail" style="float: left;">
              <el-input v-model.trim="areaInfo.addressDetail" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="路名" prop="road" style="float: right;">
              <el-input v-model.trim="areaInfo.road" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="行政区域编码" prop="xzqy" style="float: left;">
              <el-input v-model.trim="areaInfo.xzqy" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="街道编码" prop="street" style="float: right;">
              <el-input v-model.trim="areaInfo.street" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="门弄牌号" prop="mnph" style="float: left;">
              <el-input v-model.trim="areaInfo.mnph" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="楼栋幢" prop="ldz" style="float: right;">
              <el-input v-model.trim="areaInfo.ldz" :disabled="isareainfo"></el-input>
            </el-form-item>
            <el-form-item label="经度/纬度" prop="gis">
              <el-input v-model="areaInfo.gis==''?'未标记':'已标记'" :disabled="true">
                <el-button slot="append" icon="el-icon-location" @click="maptitle='编辑联网单位 - '+basicInfo.oname;innerVisible=true" :disabled="isareainfo">标记地点</el-button>
              </el-input>
            </el-form-item>
            <el-form-item label="" style="width: 100%;float: right;" v-if="!isareainfo">
              <el-button type="primary" @click="saveAreaInfo('areaForm')" style="margin-top: 10px;" size="mini">保存</el-button>
              <el-button style="margin-top: 10px;" @click="isareainfo=true;getUnitInfo(curunitid);clearFormTips('basicForm')" size="mini" type="text">取消</el-button>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row class="nework-info-wrap" v-loading="isloadbaseinfo">
          <div class="basicinfo">
            <span class="buildtitle"><i class="el-icon-caret-right"></i>单位详情</span>
            <span class="buildedit" onselectstart="return false;" v-if="isunitinfo" v-show="basicInfo.oname!=''" unselectable="on" @click="isunitinfo=!isunitinfo"><i class="el-icon-edit"></i>编辑</span>
            <span class="buildedit" onselectstart="return false;" v-else unselectable="on" @click="saveUnitInfo('unitForm')"><i class="el-icon-edit-outline"></i>保存</span>
          </div>
          <el-form :model="unitInfo" :rules="unitrules" label-position="top" ref="unitForm" class="demo-basicForm">
            <el-form-item label="法人姓名" prop="legalName" style="float: left;">
              <el-input v-model.trim="unitInfo.legalName" :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="法人电话" prop="legalPhone" style="float: right;">
              <el-input v-model.trim="unitInfo.legalPhone"  :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="法人身份证" prop="legalIdcard" style="float: left;">
              <el-input v-model.trim="unitInfo.legalIdcard" :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="单位注册时间" prop="oLicenseTimeLong" style="float: right;">
              <el-date-picker
                v-model="unitInfo.oLicenseTimeLong"
                type="date"
                format="yyyy 年 MM 月 dd 日"
                 value-format="timestamp"
                placeholder="选择日期" style="width: 100%;" :disabled="isunitinfo">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="单位联系人" prop="olinkman" style="float: left;">
              <el-input v-model.trim="unitInfo.olinkman" :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="单位联系电话" prop="olinkphone" style="float: right;">
              <el-input v-model.trim="unitInfo.olinkphone" :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="单位性质" prop="oNature" style="float: left;">
              <el-select v-model="unitInfo.oNature" placeholder="" style="width:100%;" :disabled="isunitinfo">
                <el-option label="国有企业" value="国有企业"></el-option>
                <el-option label="集体企业" value="集体企业"></el-option>
                <el-option label="民营企业" value="民营企业"></el-option>
                <el-option label="个体工商户" value="个体工商户"></el-option>
                <el-option label="中外合资企业" value="中外合资企业"></el-option>
                <el-option label="外商独资企业" value="外商独资企业"></el-option>
                <el-option label="股份制企业" value="股份制企业"></el-option>
                <el-option label="事业单位" value="事业单位"></el-option>
                <el-option label="国家机关" value="国家机关"></el-option>
                <el-option label="其他" value="其他"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="单位类型" prop="oclass" style="float: right;">
              <el-select v-model="unitInfo.oclass" placeholder="" style="width:100%;" :disabled="isunitinfo">
                <el-option label="机关" value="机关"></el-option>
                <el-option label="团体" value="团体"></el-option>
                <el-option label="企业" value="企业"></el-option>
                <el-option label="事业" value="事业"></el-option>
                <el-option label="其他" value="其他"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="单位类别" prop="otype" style="float: left;">
              <el-select v-model="unitInfo.otype" placeholder="" style="width:100%;" :disabled="isunitinfo">
                <el-option label="重点单位" value="1"></el-option>
                <el-option label="一般单位" value="2"></el-option>
                <el-option label="九小场所" value="3"></el-option>
                <el-option label="其他单位" value="4"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="是否为重点单位" prop="isKeyunit" style="float: right;">
              <el-select v-model="unitInfo.isKeyunit" placeholder="" style="width:100%;" :disabled="isunitinfo">
                <el-option label="是" value="1"></el-option>
                <el-option label="否" value="0"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="确定重点单位时间" prop="keyunitTimeLong" style="float: left;">
               <el-date-picker
                v-model="unitInfo.keyunitTimeLong"
                type="date"
                format="yyyy 年 MM 月 dd 日"
                 value-format="timestamp"
                placeholder="选择日期" style="width: 100%;" :disabled="isunitinfo">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="单位其他情况" prop="oother" style="float: left;width: 100%;">
              <el-input type="textarea" v-model.trim="unitInfo.oother" :disabled="isunitinfo"></el-input>
            </el-form-item>
            <el-form-item label="" style="width: 100%;float: right;" v-if="!isunitinfo">
              <el-button type="primary" @click="saveUnitInfo('unitForm')" style="margin-top: 10px;" size="mini">保存</el-button>
              <el-button style="margin-top: 10px;" @click="isunitinfo=true;getUnitInfo(curunitid);clearFormTips('basicForm')" size="mini" type="text">取消</el-button>
            </el-form-item>
          </el-form>
        </el-row>
        <el-row class="nework-info-wrap" v-loading="isloadbaseinfo">
          <div class="basicinfo">
            <span class="buildtitle"><i class="el-icon-caret-right"></i>操作信息</span>
          </div>
          <el-form :model="handleForm" :rules="handlerules" label-position="top" ref="handleForm" class="demo-basicForm">
            <el-form-item label="修改人" prop="changeacc" style="float: left;">
              <el-input v-model.trim="handleForm.changeacc" :disabled="isedithandle"></el-input>
            </el-form-item>
            <el-form-item label="修改时间" prop="changetime" style="float: right;">
              <el-input v-model.trim="handleForm.changetime" :disabled="isedithandle"></el-input>
            </el-form-item>
            <el-form-item label="创建人" prop="createacc" style="float: left;">
              <el-input v-model.trim="handleForm.createacc" :disabled="isedithandle"></el-input>
            </el-form-item>
            <el-form-item label="创建时间" prop="createtime" style="float: right;">
              <el-input v-model.trim="handleForm.createtime" :disabled="isedithandle"></el-input>
            </el-form-item>
          </el-form>
        </el-row>
        </div>
      </el-container>
      <el-aside class="net-buildtrees" width="250px">
        <el-scrollbar style="height:85vh">
          <div class="unit-right-header">
          <p class="right-tree-title"><i class="el-icon-caret-right"></i>全部联网单位
            <span class="net-addbuild"  onselectstart="return false;" unselectable="on" @click="addUnit">
              <i class="el-icon-plus"></i>添加</span>
          </p>
          <el-input placeholder="请输入内容" class="input-with-select" v-model.trim="unitval" suffix-icon="el-icon-search" @keydown.enter.native="searchUnit" clearable>
          </el-input>
          </div>
          <ul class="unit-right-list" v-loading="isloadunit">
            <li v-for="(item,index) in unitList" class="network-delete-list" :class="{unitrightactive:item.id==curunitid}" @click="getUnitInfo(item.id)" :title="item.oname">{{item.oname|cutString}}
              <span
                 class="network-delete"
                 @click.stop="delunit(item.id,index)"
                >
                <icon-svg
                icon-class="shanchu"
                style="fill:rgba(80, 227, 194, 0.7)" />
              </span>
            </li>
            <li v-show="unitList.length==0">暂无数据</li>
          </ul>
        </el-scrollbar>
      </el-aside>
      <addNetUnit :Show.sync="isaddnetunit" @addSuccess="addSuccess"></addNetUnit>
      <el-dialog title="删除联网单位" :visible.sync="dialogDeleteVisible" :show-close='false' custom-class="xf-jc-dialog" width="360px">
        <div class="xf-jc-deletect">
          <p v-if="buildcount.length!==0">有{{buildcount.length}}个建筑绑定了此联网单位，无法删除。请将联网单位与建筑解绑后再进行删除</p>
          <p v-if="buildcount.length!==0" style="cursor: pointer;color: #2683f5;" @click="viewmoreunit">查看建筑<i class="el-icon-d-arrow-right"></i></p>
          <p v-else>无建筑绑定此联网单位，确定删除吗？</p>
        </div>
        <div slot="footer" class="dialog-footer" v-if="buildcount.length==0">
          <el-button type="danger" size="mini"  @click="sureDelUnit()">删除</el-button>
          <el-button size="mini" type="text" @click="dialogDeleteVisible = false">取消</el-button>
        </div>
        <div slot="footer" class="dialog-footer" v-else>
          <el-button type="primary" size="mini"  @click="dialogDeleteVisible = false">知道了</el-button>
        </div>
      </el-dialog>
      <viewChildBuild :Show.sync="childSitesShow" :siteIds.sync="childSiteids"></viewChildBuild>
      <mapMarker :Show.sync="innerVisible" @getMark="getMark" :gis="areaInfo.gis" :maptitle="maptitle"></mapMarker>
    </el-container>
  </div>
</template>

<script>
import {
  getBuildAll,//获取所有建筑
  getUnitAll,//获取所有联网单位
  deleteSearch,//删除查询
  deleteUnit,//删除联网单位
  updateUnit,//更新联网单位信息
  getOneUnitInfo,//获取单个联网单位信息
} from "@/api/admin/network/index";
import { mapGetters } from "vuex";
import addNetUnit from "./addnetunit";
import viewChildBuild from "@/components/ViewChildBuild";
import mapMarker from "@/components/mapMark";
import {IdentityCodeValid} from '@/utils/validate';
export default {
  name: "",
  components: {addNetUnit,viewChildBuild,mapMarker},
  data() {
    function isnumber(rule, value, callback){
        let reg=/^\d+$/;//非负整数
            if (!reg.test(value)&&value!="") {
              callback(new Error('请输入数字!'))
            }else{
              callback();
            }
    };
    function isphone(rule, value, callback){
      let isPhone = /^([0-9]{3,4}-)?[0-9]{7,8}$/;//手机号码
      let isMob= /^0?1[3|4|5|7|8][0-9]\d{8}$/;// 座机格式
      if(isMob.test(value)||isPhone.test(value)){
          callback();
      }
      else if(value!=""){
          callback(new Error('电话格式不正确!'))
      }else{
        callback();
      }
    };
    function checkIdentity(rule, value, callback){
          let result=IdentityCodeValid(value);
              //var reg = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;
          if(!result.pass&&value!=''){
              callback(new Error(result.tip));
          }else{
              callback();
          }
    };
    let self=this;
    return {
      showdelete:"",
      maptitle:"",
      unitList:[],
      curunitid:"",//当前联网单位id
      curdelunitid:"",
      unitval:"",
      childSitesShow: false,
      isloadunit:false,
      buildcount:[],
      childSiteids: "",
        basicInfo:{
          oname:"",
          olicense:"",
          ophone:"",
          oaddress:"",
          safeDutyName:"",
          safeDutyPhone:"",
          safeDutyIdcard:"",
          safeManagerName:"",
          safeManagerPhone:"",
          safeManagerIdcard:"",
        },
        areaInfo:{
          addressDetail:"",
          road:"",
          xzqy:"",
          street:"",
          mnph:"",
          ldz:"",
          gis:"",
        },
        unitInfo:{
          legalName:"",
          legalPhone:"",
          legalIdcard:"",
          oLicenseTimeLong:"",
          olinkman:"",
          olinkphone:"",
          oNature:"",
          oclass:"",
          otype:"",
          isKeyunit:"",
          keyunitTimeLong:"",
          oother:""
        },
        handleForm:{
          changeacc:"",
          changetime:"",
          createacc:"",
          createtime:"",
        },
        isbasicinfo:true,
        isareainfo:true,
        isunitinfo:true,
        isedithandle:true,
        basicrules:{
          oname:[{required: true,message: '此项不能为空',trigger: 'blur'},{max: 100,message: '长度在100个字符以内',trigger: 'blur'}],
          olicense:[{required: true,message: '此项不能为空',trigger: 'blur'},{max: 100,message: '长度在100个字符以内',trigger: 'blur'}],
          ophone:[{required: true,message: '此项不能为空',trigger: 'blur'},
          {validator:isphone,trigger:'blur'}],
          oaddress:[{required: true,message: '此项不能为空',trigger: 'blur'},{max: 200,message: '长度在200个字符以内',trigger: 'blur'}],
          safeDutyName:[{required: true,message: '此项不能为空',trigger: 'blur'},{max: 50,message: '长度在50个字符以内',trigger: 'blur'}],
          safeDutyPhone:[{required: true,message: '此项不能为空',trigger: 'blur'},
          {validator:isphone,trigger:'blur'}],
          safeDutyIdcard:[{required: true,message: '此项不能为空',trigger: 'blur'},
          {validator:checkIdentity,trigger:'blur'}],
          safeManagerName:[{required: true,message: '此项不能为空',trigger: 'blur'},{max: 50,message: '长度在50个字符以内',trigger: 'blur'}],
          safeManagerPhone:[{required: true,message: '此项不能为空',trigger: 'blur'},
          {validator:isphone,trigger:'blur'}],
          safeManagerIdcard:[{required: true,message: '此项不能为空',trigger: 'blur'},
          {validator:checkIdentity,trigger:'blur'}],
        },
        arearules:{
          addressDetail:[{max: 200,message: '长度在200个字符以内',trigger: 'blur'}],
          road:[{max: 60,message: '长度在60个字符以内',trigger: 'blur'}],
          xzqy:[{max: 6,message: '长度在6个字符以内',trigger: 'blur'},{validator:isnumber,trigger:'blur'}],
          street:[{max: 3,message: '长度在3个字符以内',trigger: 'blur'},{validator:isnumber,trigger:'blur'}],
          mnph:[{max: 60,message: '长度在60个字符以内',trigger: 'blur'}],
          ldz:[{max: 20,message: '长度在20个字符以内',trigger: 'blur'}],
          gis:[{required: true,message: '此项不能为空',trigger: 'blur'}],
        },
        unitrules:{
          legalName:[{max: 50,message: '长度在50个字符以内',trigger: 'blur'}],
          legalPhone:[{validator:isphone,trigger:'blur'}],
          legalIdcard:[{validator:checkIdentity,trigger:'blur'}],
          olicenseTime:[],
          olinkman:[{max: 50,message: '长度在50个字符以内',trigger: 'blur'}],
          olinkphone:[{validator:isphone,trigger:'blur'}],
          oNature:[],
          oclass:[],
          otype:[],
          isKeyunit:[],
          keyunitTime:[],
          oother:[{max: 200,message: '长度在200个字符以内',trigger: 'blur'}]
        },
        handlerules:{},
        isloadbaseinfo:false,
        isaddnetunit:false,
        dialogDeleteVisible:false,
        innerVisible:false,
    };
  },
  created() {
    this.getAllBuild();
  },
  filters: {
    cutString: function (value) {
      value = value.toString();
      if (value.length>10) {
        return value.substring(0,15)+"...";
      }else{
        return value
      }
    }
  },
  computed: {},
  methods: {
    getAllBuild(){
        this.isloadunit=true;
        getUnitAll(this.unitval).then(res=>{
          if (res.length!==0) {
            this.unitList=res;
            this.isloadunit=false;
            return this.unitList;
          }else{
            this.unitList=res;
            this.resetVal();
            this.isloadunit=false;
            return false;
          }
        }).then((res)=>{
          if (res) {
            this.getUnitInfo(res[0].id)
          }
        }).catch(()=>{
          this.isloadunit=false;
        })
    },
    saveBasicInfo(formName){
      const set = this.$refs;
        set[formName].validate((valid) => {
        if (valid) {
        let senobj=Object.assign({},this.basicInfo,{id:parseInt(this.curunitid)})
        updateUnit(senobj).then(res=>{
          this.$notify({
              title:"成功",
              message: "更新成功!",
              type: "success",
              duration: 2000
          });
          this.isbasicinfo=true
          this.isloadunit=true;
          getUnitAll(this.unitval).then(res=>{
            this.unitList=res;
            this.isloadunit=false;
            return this.unitList;
          }).then((res)=>{
            this.getUnitInfo(this.curunitid)
          })
        })
      }
      })
    },
    saveAreaInfo(formName){
      const set = this.$refs;
        set[formName].validate((valid) => {
        if (valid) {
        let senobj=Object.assign({},this.areaInfo,{id:parseInt(this.curunitid)})
        updateUnit(senobj).then(res=>{
              this.$notify({
              title:"成功",
              message: "更新成功!",
              type: "success",
              duration: 2000
            });
              this.isareainfo=true
        }).then(()=>{
          this.getUnitInfo(this.curunitid)
        })
       }
      })
    },
    saveUnitInfo(formName){
      const set = this.$refs;
        set[formName].validate((valid) => {
        if (valid) {
        let senobj=Object.assign({},this.unitInfo,{id:parseInt(this.curunitid)})
        updateUnit(senobj).then(res=>{
            this.$notify({
                title:"成功",
                message: "更新成功!",
                type: "success",
                duration: 2000
            });
            this.isunitinfo=true;
        }).then(()=>{
            this.getUnitInfo(this.curunitid)
        })
        }
      })
    },
    addUnit(){
      this.isaddnetunit=true;
    },
    delunit(id,index){
      this.curdelunitid=id;
      deleteSearch(this.curdelunitid).then(res=>{
        this.buildcount=res.data;
      }).then(()=>{
        this.dialogDeleteVisible=true;
      })
    },
    sureDelUnit(){
      deleteUnit(this.curdelunitid).then(res=>{
        this.$notify({
            title:"成功",
            message: "删除成功!",
            type: "success",
            duration: 2000
        });
        this.getAllBuild();
        this.dialogDeleteVisible=false;
      })
    },
    viewmoreunit(){
      this.childSitesShow=true;
      this.childSiteids=this.buildcount.toString();
    },
    handledata(data){
        this.resetVal();
        for(let item in data){
          if (this.basicInfo.hasOwnProperty(item)) {
            this.basicInfo[item]=data[item];
          }else if (this.areaInfo.hasOwnProperty(item)) {
            this.areaInfo[item]=data[item];
          }else if (this.unitInfo.hasOwnProperty(item)) {
            this.unitInfo[item]=data[item];
          }else if (this.handleForm.hasOwnProperty(item)) {
            this.handleForm[item]=data[item];
          }
        }
    },
    resetVal(){
        for(let item in this.basicInfo){
          this.basicInfo[item]="";
        };
        for(let item in this.areaInfo){
          this.areaInfo[item]="";
        };
        for(let item in this.unitInfo){
          this.unitInfo[item]="";
        };
        for(let item in this.handleForm){
          this.handleForm[item]="";
        }
      },
    getUnitInfo(id){
      this.curunitid=id;
      this.isloadbaseinfo=true
      getOneUnitInfo(this.curunitid).then(res=>{
        this.handledata(res.data)
        this.isloadbaseinfo=false;
      }).catch(()=>{
        this.isloadbaseinfo=false;
      })
    },
    searchUnit(){
      this.getAllBuild();
    },
    getMark(val){
      this.areaInfo.gis=val;
      this.innerVisible=false;
    },
    addSuccess(val){
      if (!val) {
        this.isaddnetunit=false;
        this.getAllBuild();
      }
    },
    clearFormTips(fromname){
      this.$refs[fromname].clearValidate();
    }
  },
  mounted(){

  }
};
</script>
<style rel="stylesheet/scss" lang="scss">
  .network-delete{
    visibility: hidden;
  }
  .network-delete-list{
    &:hover{
      .network-delete{
        visibility: visible;
      }
    }
  }
.unit-all-container{
  padding:0 0 0 20px;
  display:flex;
  justify-content: space-between;
}
.buildtitle{
  font-size:24px;
}
.buildedit{
  font-size:14px;
  user-select:none;
  cursor:pointer;
}
.demo-basicForm{
  margin-top:24px;
}
@media screen and (max-width: 1440px) {
      .nework-info-wrap{
        width: 94%;
      }
}
@media screen and (min-width: 1441px) {
    .nework-info-wrap{
      width: 68%;
    }
}
.nework-info-wrap{
  .el-form-item__label{
    padding:0;
    color: rgba(255, 255, 255, 0.7);
  }
  .el-form-item{
    margin-bottom: 12px;
    width: 48.9%;
  }
}
.net-buildtrees{
  height:90vh;
  background: linear-gradient(-140deg, transparent 2em, #0A1722 0);
  margin-right: 10px;
  position: relative;
  box-sizing: border-box;
  padding-left: 10px;
  padding-right: 10px;
  &:before{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border:2px solid #50E3C2;
    clip-path: polygon(0 0,30px 0,30px 100%,0 100%);
  }
}
.unit-right-header{
   padding:10px 0 0;
}
.net-buildtrees .el-scrollbar__wrap {
   overflow-x: hidden;
}
.net-addbuild{
  float:right;
  cursor:pointer;
  color:#50E3C2;
  font-size:16px;
  user-select:none;
  margin-right: 20px;
}
.unit-right-list{
  list-style:none;
  margin-top:17px;
  padding:0;
  min-height: 100px;
}
.unit-right-list li{
  display:flex;
  justify-content:space-between;
  padding:10px 22px;
  color:rgba(255,255,255,.7);
  cursor:pointer;
  font-size: 14px;
  &.unitrightactive{
    background:rgba(0,0,0,.3);
    color: #50E3C2;
  }
}
.dialog-header{
    padding: 16px 10px 26px;
    display: flex;
    justify-content: space-between;
  }
  .marktitle{
    font-size: 24px;
  }
  .mapwrap{
    width: 100%;
    height: 740px;
  }
  .innerdialog .el-dialog__body{
    padding: 0;
  }
  .innerdialog{
    border-radius: 10px;
  }
  .search-box{
    position:absolute !important;
    margin-left:50%;
    transform:translateX(-50%);
    margin-top:10px;
  }
.unit-all-container .el-input__inner{
  color:rgba(255,255,255,.7) !important;
}
.unit-all-container .el-textarea.is-disabled .el-textarea__inner{
  color:rgba(255,255,255,.7) !important;
}
</style>
